import { BrowserModule } from "@angular/platform-browser";
import { NgModule } from "@angular/core";
import { FormsModule } from "@angular/forms";
import { RouterModule, PreloadAllModules } from "@angular/router";

import { HttpClientModule } from "@angular/common/http";
import { HttpClientInMemoryWebApiModule } from "angular-in-memory-web-api";
import { InMemoryDataService } from "./in-memory-data.service";

import { routes } from "./router";
import { APP_RESOLVER_PROVIDERS } from "./resolver";

import { AppComponent } from "./app.com";
import { HeroesComponent } from "./heroes/heroes";
import { HeroDetailComponent } from "./heroes-detail/heroes-detail";
import { DashboardComponent } from "./dashboard/dashboard.component";
import { MessagesComponent } from "./messages/messages.component";

import { HeroService } from "./hero.service";
import { MessageService } from "./message.service";
import { HeroSearchComponent } from './hero-search/hero-search.component';


// Application wide providers
const APP_PROVIDERS = [
  ...APP_RESOLVER_PROVIDERS
];


@NgModule({
  imports: [
    BrowserModule,
    FormsModule,
    HttpClientModule,
    HttpClientInMemoryWebApiModule.forRoot(InMemoryDataService, {
      dataEncapsulation: false
    }),
    RouterModule.forRoot(routes, {
      useHash: Boolean(history.pushState) === false
      // preloadingStrategy: PreloadAllModules
    })
  ],
  declarations: [
    AppComponent,
    HeroesComponent,
    HeroDetailComponent,
    DashboardComponent,
    MessagesComponent,
    HeroSearchComponent
  ],
  providers: [
    HeroService,
    MessageService,
    ...APP_PROVIDERS
  ],
  bootstrap: [AppComponent]
})
export class AppModule {}
